<!doctype html>
<html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge,chrome=1">
    <title>Document01</title>
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.2.3/css/bootstrap.min.css" rel="stylesheet"
          crossorigin="anonymous"/>

</head>

<body>
<div class="container">
    <h2 class="page-header">Promise 初体验</h2>
    <!-- 需求：点击按钮，2s后显示是否抽奖（百分之三十的概率中奖） -->
    <button class="btn btn-primary" id="btn">点击抽奖</button>
</div>

<script>

    //求随机数
    function rand(m, n) {
        return Math.ceil(Math.random() * (n-m+1)) + m - 1;
    }
    var btn = document.querySelector('.btn');
    btn.addEventListener('click', () => {
        //30%中奖概率 1-100
        //获取从1-100的一个随机数
        //定时器
        setTimeout(() => {
            let n = rand(1, 100)
            if(n <= 30) {
                alert('中奖了');
            } else {
                alert('再接再厉')
            }
        }, 1000)
    })
</script>

</body>
</html>
